
$(function(){
    var echartsWidth = $("section").width() - 50;
    $("#barline_echart").css("width",echartsWidth + "px");
    
    // var timeArr={1:{"name":"month"},2:{"name":"day"},3:{"name":"hour"},4:{"name":"minutes"},5:{"name":"second"}};
    var $timeType = '1';
    var $hideTimeStr = $("#select_year select").val();
    $("#echart_time b").text($hideTimeStr);
    getData($hideTimeStr,$timeType);

    $("#select_year select").change(function(){
        $hideTimeStr = $(this).val();
        $timeType = '1';
        $("#echart_time b").text($hideTimeStr);
        getData($hideTimeStr,$timeType);
    });

    $("section").on("click","#back_pevtime",function(){
        var showTimeStr;
        if($timeType>1){
            $timeType --;
        }else{
            alert("请选择其他年份");
            return;
        }
        var year,month,day,hour,minute,second;
        $hideTimeStr = $hideTimeStr.slice(0,$hideTimeStr.length-2);

        year = $hideTimeStr.slice(0,4) !=''?$hideTimeStr.slice(0,4):"";
        month = $hideTimeStr.slice(4,6) !=''?"-"+$hideTimeStr.slice(4,6):"";
        day = $hideTimeStr.slice(6,8) !=''?"-"+$hideTimeStr.slice(6,8):"";
        hour = $hideTimeStr.slice(8,10) !=''?" "+$hideTimeStr.slice(8,10):"";
        minute = $hideTimeStr.slice(10,12)!=''?":"+$hideTimeStr.slice(10,12):":00";
        second = ":00";
       
        if($timeType == "4"){
            showTimeStr = year+month+day+hour+minute+second;
        }else if($timeType == "3"){
            showTimeStr = year+month+day;
        }else if($timeType == "2"){
            showTimeStr = year+month;
        }else if($timeType == "1"){
            showTimeStr = year;
        }else if($timeType == "0"){
            alert("请选择其他年份");
            return;
        }
       
        $("#echart_time b").text(showTimeStr);
        getData($hideTimeStr,$timeType);
    });

function getData($time,$timeType){
    $.ajax({
        type:'get',
        dataType:'json',
        url:'/index.php?d=backstage&c=goldtimes/selecttime',
        data:{
            time: $time,
            type: $timeType
        },
        success:function(res){
            if(res.code == "200"){
                var xAxisArr = [];
                var peroArr =[];
                var seedArr = [];
                var unit = '';
                if(res.data != ''){
                    for(var i in res.data){
                        var item = res.data[i];
                        if($.isEmptyObject(item) || !item.sumpero || !item.sumseed){
                            item.sumpero = 0;
                            item.sumseed = 0;
                        }
                        if($timeType == '1'){
                            unit = "月";
                        }else if($timeType == '2'){
                            unit = "日";
                        }else if($timeType == '3'){
                            unit = "时";
                        }else if($timeType == '4'){
                            unit = "分";
                        }else if($timeType == '5'){
                            unit = "秒";
                        }
                        xAxisArr.push(i+unit);
                        peroArr.push(item.sumpero);
                        seedArr.push(item.sumseed);
                    }
                    renderEchart(xAxisArr,peroArr,seedArr,unit);
                }
            }
        },
        beforeSend:function(){
            loadingShow();
        },
        complete:function(){
            loadingHide();
        }
    });
};


var echarts;
require.config({
	packages: [
				{
					 name: 'echarts',
					 location: 'public/static/bootstrap/js/lib',
					 main: 'echarts'
				},
				{
					name: 'zrender',
					location: 'public/static/bootstrap/js/lib',
					main: 'zrender'
				}
	         ]
});
require(
	[
		'echarts',
		'echarts/chart/bar',
		'echarts/chart/line',
    ],
    function (ec) {
		echarts = ec;
	}
);

	var indexEchartId = {'barline_echart' : 0}

	function renderEchart($xAxisArr,$peroArr,$seedArr,$title){
		if (! echarts) {
            setTimeout(function () {
                renderEchart();
            },1000);
            return;
        }
        var goldEChart,goldOption;
        var EChartId = indexEchartId['barline_echart'];
        var ecConfig = require('echarts/config');
        var zrEvent = require('zrender/tool/event');
        var colorArr = ['#e35d5d','#00ff29','#5284dc','#e29412','#00a0e9',
                    '#b5003b','#ea68a2','#ae5da1','#ff008e','#e4e400',
                    '#5f52a0','#005a9e','#00b7ee','#ff6900','#2f009e',
                    '#7ecef4','#015629','#22ac38','#8fc31f','#ac00ff',
                    '#04dead','#b30000','#6700b3','#c2c500','#0600ff'];
        var newColor = [];
        for(var i=0;i<2;i++){
            var colorRandom = Math.floor(Math.random()*colorArr.length);
            newColor.push(colorRandom);
        }
        if(EChartId == 0){
        	goldEChart = echarts.init(document.getElementById('barline_echart'));
        	goldOption = {
        		title:{
                    text:$title+'投注分析',
                    subtext:'点击图表查看下一层级投注分析',
                    subtextStyle:{
                        color:"#78a4e0",
                        fontSize: 14,
                    },
                    x:'left',
                    y:'top',
                    textStyle:{
                        fontSize: 15,
                        fontWeight: 'bolder',
                        color: '#ff0000'
                    }
                },
                legend:{
                    y:'60',
                    data:['人数','种子数'],
                },
                tooltip: {
                    show: true,
                    axisPointer:{
                        type: "line"
                    }
                },
                tooltip : {
                    trigger: 'axis',
                    axisPointer:{
                        type:'line',
                        lineStyle: {
                            color: '#000',
                            width: 2,
                            type: 'solid'
                        },
                    }
                },
                xAxis : [
                    {
                        type : 'category',
                        // boundaryGap : false,
                        axisLine:{
                            lineStyle:{
                                color: '#000',
                                width: 2,
                                type: 'solid'
                            }
                        },
                        data: $xAxisArr
                    }
                ],
                yAxis : [
                    {   
                        name:'人数',
                        type : 'value',
                        axisLine:{
                            lineStyle:{
                                color: '#000',
                                width: 2,
                                type: 'solid'
                            }
                        }
                    },
                    {
                        name:'种子数',
                        type : 'value',
                        axisLine:{
                            lineStyle:{
                                color: '#000',
                                width: 2,
                                type: 'solid'
                            }
                        }
                    }
                ],
                grid : {
                    borderWidth: 0,
                    x : '70px',
                    y : '110px',
                    x2 : '70px',
                    y2 : '20px',
                },
                series : [
                    {
                        name:"人数",
                        type:"bar",
                        barWidth:30,
                        itemStyle:{
                                    normal:{
                                        color:colorArr[newColor[0]],
                                    }
                                },
                        data: $peroArr
                    },
                    {
                        name:"种子数",
                        type:"line",
                        symbol:'emptyCircle',
                        symbolSize:3,
                        yAxisIndex:1,
                        itemStyle:{
                                    normal:{
                                        color:colorArr[newColor[1]]
                                    }
                                },                  
                        data: $seedArr
                    }
                ]
        	};
        }else{
        	goldEChart = echarts.getInstanceById(EChartId);
        	goldOption = goldEChart.getOption();
        }

        goldEChart.clear();
        goldEChart.setOption(goldOption);
        if(EChartId == 0){
        	indexEchartId[barline_echart] = goldEChart.id;
        	$(window).resize(function(){
               goldEChart.resize();
            });
        }

        var ecConfig = require('echarts/config');
        function eConsole(param) {
            var ajaxTime = param.dataIndex;
            var showTimeStr,year,month,day,hour,minute,second;
            if($timeType<5){
                $timeType++;
                if($timeType == "2" || $timeType == "3"){
                    ajaxTime = param.dataIndex + 1;
                }
            }else{
                alert("已经到秒了");
                return;
            }
            ajaxTime = ajaxTime<10?"0"+ajaxTime:ajaxTime;
            $hideTimeStr = $hideTimeStr + ajaxTime;

            year = $hideTimeStr.slice(0,4) !=''?$hideTimeStr.slice(0,4):"";
            month = $hideTimeStr.slice(4,6) !=''?"-"+$hideTimeStr.slice(4,6):"";
            day = $hideTimeStr.slice(6,8) !=''?"-"+$hideTimeStr.slice(6,8):"";
            hour = $hideTimeStr.slice(8,10) !=''?" "+$hideTimeStr.slice(8,10):"";
            minute = $hideTimeStr.slice(10,12)!=''?":"+$hideTimeStr.slice(10,12):":00";
            second = ":00";
            if($timeType == "2"){
                showTimeStr = year+month;
            }else if($timeType == "3"){
                showTimeStr = year+month+day;
            }else if($timeType == "4" || $timeType == "5"){
                showTimeStr = year+month+day+hour+minute+second;
            }else{
               alert("已经到秒了");
                return; 
            }
            $("#echart_time b").text(showTimeStr);
            getData($hideTimeStr,$timeType);
            goldEChart.setOption(goldOption);
        }
        goldEChart.on(ecConfig.EVENT.CLICK, eConsole);
	};
});
